var movieSearchBtn = document.getElementById("movie-search-btn"),
    movieSearchContent = document.getElementById("movie-search-content"),
    movieSearchWaiting = document.getElementById("movie-search-waiting"),
    movieSearchResultBox = document.getElementById("movie-search-result-box"),
    movieFirstContentBox = document.getElementById("movie-first-content-box"),
    movieSecondContentBox = document.getElementById("movie-second-content-box"),
    movieThirdContentBox = document.getElementById("movie-third-content-box"),
    // movieForthContentBox = document.getElementById("movie-forth-content-box")
    movieDetailContentBox = document.getElementById("movie-detail-content-box");

// 返回的图书图片大小比例不一需用js进行动态样式调整
function movieImgAdjust() {
    var imgs = document.getElementsByClassName("movie-search-result-img");
    // console.log(movieSearchResultBox);
    var imgWidth = imgs[1].offsetWidth;
    // console.log(boxWidth);
    // var imgWidth = imgs[0].style.width;
    console.log(imgWidth);
    for (var i = 0; i < imgs.length; i++) {
        imgs[i].setAttribute("height",imgWidth / 3 * 4);
    }
}

// 搜书模块
// JSONP
var movieDataSearch;
function movieSearchCallback(result) {
    //    alert(result);
    console.log(result);
    movieSearchWaiting.style.display = "none";

    var html = template("movieSearchTemp", result);
    // console.log(html);
    movieSearchResultBox.innerHTML = html;
    MovieDataSearch = result;
    // console.log("123");
    // 动态调整样式
    // movieImgAdjust();


}

function searchMovie()
{
    var JSONP=document.createElement("script");
    JSONP.type="text/javascript";
    JSONP.src="https://api.douban.com/v2/movie/search?q="+movieSearchContent.value+"&callback=movieSearchCallback";
    document.getElementsByTagName("head")[0].appendChild(JSONP);
}

// 分类图书
// 进入页面后就开始发送请求获取各类图书

var movieDataFirst;//由于data-*属性的局限  所以我们将四组数据保存在这里  以方便点击详情使用 从而不用再次查询
var movieDataSecond;
var movieDataThird;
// var movieDataForth;
function movieFirstCallback(result) {
    var html = template("movieClassTemp", result);
    movieFirstContentBox.innerHTML = html;
    movieDataFirst = result;
}
function movieSecondCallback(result) {
    console.log(result);
    var html = template("movieClassTemp", result);
    movieSecondContentBox.innerHTML = html;
    movieDataSecond = result;
}
function movieThirdCallback(result) {
    var html = template("movieClassTemp", result);
    movieThirdContentBox.innerHTML = html;
    movieDataThird = result;
}
function movieForthCallback(result) {
    var html = template("movieClassTemp", result);
    movieForthContentBox.innerHTML = html;
    movieDataForth = result;
    // 所有块布局完成后调整方块
    // imgAdjust();
}
function movieCalss(value,callback)
{
    var JSONP=document.createElement("script");
    JSONP.type="text/javascript";
    // https://api.douban.com/v2/movie/in_theaters?city=%E5%8C%97%E4%BA%AC
    JSONP.src="https://api.douban.com/v2/movie/"+value+"callback="+callback;
    document.getElementsByTagName("head")[0].appendChild(JSONP);
}

movieCalss("in_theaters?city=北京&","movieFirstCallback");
// setTimeout(function () {
    movieCalss("coming_soon?","movieSecondCallback");
// },3000);
// setTimeout(function () {
    movieCalss("top250?","movieThirdCallback");
// },6000);
// setTimeout(function () {
    // movieCalss("生活","movieForthCallback");
// },9000);
//
// setTimeout(function () {
//     movieImgAdjust();
// },10000);


movieSearchBtn.onclick = function(event){
    console.log("123");
    console.log(movieSearchContent.value);
    if(movieSearchContent.value){
        // 搜索等待动画
        movieSearchWaiting.style.display = "block";
        searchMovie();
    }
};


//movie 详情渲染
function movieResultDetail(button) {
    console.log(button.parentNode.parentNode);
    switch (button.parentNode.parentNode.getAttribute("id")) {
        case "movie-first-content-box":
        console.log();
            movieResultRender(movieDataFirst,button.parentNode.dataset.index);
            break;
        case "movie-second-content-box":
            movieResultRender(movieDataSecond,button.parentNode.dataset.index);
            break;
        case "movie-third-content-box":
            movieResultRender(movieDataThird,button.parentNode.dataset.index);
            break;
        // case "movie-forth-content-box":
        //     resultRender(dataForth,button.parentNode.dataset.index);
        //     break;
        default:
            movieResultRender(movieDataSearch,button.parentNode.dataset.index);
            break;
    }
}
function movieResultRender(result, index) {
    console.log(result.subjects[index]);
    // result.movies[index].summary = result.movies[index].summary.replace(/[\n]/g,"<br>");
    var html = template("movieDetailTemp", result.subjects[index]);
    movieDetailContentBox.innerHTML = html;
}


function movieResultCardIn(div) {
    div.getElementsByTagName("button")[0].style.display="block";
}
function movieResultCardOut(div) {
    div.getElementsByTagName("button")[0].style.display="none";
}

// movieTopxxx();
